<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>文章-个人博客</title>
<meta name="keywords" content="前端模板">
<meta name="description" content="前端模板">
<script src="static/js/jquery/jquery-2.1.4.min.js" type="text/javascript"></script>
<script src="static/layui/layui.js" type="text/javascript"></script>
<script src="static/js/index/index.js" type="text/javascript"></script>
<script src="static/js/index/freezeheader.js" type="text/javascript"></script>
<script src="static/layui/lay/modules/layer.js" type="text/javascript"></script>
<script src="static/js/index/sliders.js" type="text/javascript"></script>
<script src="static/js/index/html5.js" type="text/javascript"></script>
<script src="static/js/index/article_details.js" type="text/javascript"></script>
<link rel="stylesheet" href="static/layui/css/layui.css" media="all"/>
<link rel="stylesheet" href="static/layui/css/modules/layer/default/layer.css"/>
<link rel="stylesheet" href="static/css/global.css"/>

</head>
<body>

 

<div class="layui-container container">
  <div class="layui-row layui-col-space20">
    <div class="layui-col-md8">
      <div   id="saveTr">
          <span class="layui-breadcrumb">
              <a href="index.html">首页</a>
              <a href="article.html">文章</a>
             
              <a><cite> {{article.title}} </cite></a>
    	</span>
        <hr class="layui-bg-red">
        <div class="content" id="photos">
        	<h2 class="c_titile">{{article.title}}</h2>
            <p class="box_c"><span class="d_time">发布时间：{{article.publishTime}}</span>
            	<span>编辑：{{article.source}}</span>
            	<span>阅读: {{article.clickNum}}</span></p>
        <div class="detail-body">
           <h3 style="text-align: justify;"><b>一、抹前言</b></h3>
             <p v-html="article.content"></p>	
           
           </p>
      
        </div>
        
        <fieldset class="layui-elem-field layui-field-title" style="margin: 0px 0px; text-align: center;">
          <legend>评论</legend>
        </fieldset>
	<div class="detail-box" >
        <a name="comment"></a>
        <ul class="jieda" id="jieda"  v-for="a in arel">
          <li data-id="12" class="jieda-daan" >
            <a name="item-121212121212"></a>       
            <div class="detail-about detail-about-reply">
              <a class="jie-user" href="">
                <img src="static/images/default.png" alt="">
                <cite>
                  <i>{{a.userName}}</i>
                 <em>(楼主)</em>
                  <em style="color:#999">（该号已被封）</em> 
                </cite>
              </a>
              <div class="detail-hits">
                <span>{{a.addtime}}</span>
              </div>
              <i class="iconfont icon-caina" title="最佳答案"></i>
            </div>
            <div class="detail-body jieda-body">
              <p>{{a.content}}</p>             
            </div>

            <div class="jieda-reply">
             <span class="jieda-zan" type="zan" id="zan"><i class="iconfont icon-zan"></i><em>{{a.praiseCount}} </em></span>
              <span type="reply"><i class="iconfont icon-svgmoban53" ></i>回复</span>
              <div class="jieda-admin">
              </div> 
            </div>
            
          </li>
        </ul>
     	<div id="da"></div>
     	
      	<div id="page_reply"></div>
      	
      	
        <div class="layui-form layui-form-pane">
            
                <textarea id="texta" name="texta"  rows=15 cols=108 ></textarea>

            <div class="layui-form-item"> 
              <input type="button" class="layui-btn" id="btn"    value="提交回复"/>
            </div>
        </div>
        
      </div>
      </div>
      </div>
    </div>
    <div class="layui-col-md4">
    <div class="article-fenlei">
        <h3>文章分类</h3>
  
      </div>
     
     
        
            <div class="ms-main" id="ms-main" >
            	 <div id="a">
                <div style="display: block;" class="bd bd-news"  >	
                    <ul>
                        <li v-for="ac in article">
                        	<a href="article_details.html" @click="edit(ac.articleId)" target="_blank"> 
                        		{{ac.title}}
                        	</a>
                        </li>
                    </ul>
                   </div>
              </div> 
            </div>
  
      <div class="ad"> <img src="static/images/03.jpg"> </div>
    </div>
  </div>
</div>
 
     
  <script src="../js/axios.min.js"></script>
  <script type="text/javascript" src="../js/vue.min.js"></script>
  <script type="text/javascript" src="../js/jquery.min.js" ></script>
  <script type="text/javascript" src="../js/jquery.cookie.js"></script>
  <script>
  		var sum=0;
  		 var id=$.cookie("articleId");
				$(function(){
			/*	$("#zan").click(function(){
					alert("0");
					sum++;
					$("#zan").html("<i class='iconfont icon-zan'></i><em>"+sum+"</em>" );
				});
				*/
					$("#btn").click(function(){		
						sum++;
					$("#zan").html("<i class='iconfont icon-zan'></i><em>"+sum+"</em>" );
						
						
						
					var content=$("#texta").val()
				 
					var params = {
						"otherId":id,
						"content": content,						 
					}
						$.ajax({
						type: "post",
						url: "http://localhost:9095/user/e/insert1",
						data: params,
						dataType: 'json',
						success: function() {
							alert("请求成功");
							location.reload();
						},
						error: function(result) {
							alert("error");
						}
					})
				})	
			});
  </script>
  
  <script>
  	
  	
         
  	
			const a = new Vue({
				el: "#a",
				data: {
					article: []
					 		
				},
				methods: {
 
					edit:function(articleId){			 		 
			 		  $.cookie("articleId",articleId);  
					},
				},
				created() {
					let _this = this;
					axios.get("http://localhost:9095/user/e/listAll").then(function(response) {
						_this.article = response.data.data;	 
						console.log(response.data.data);
					});				
				}
			})
		</script>
  
   <script>
        	 
              
            var id=$.cookie("articleId");
            
     
			const saveTr = new Vue({
				el: "#saveTr",
				data: {
					article: [],
					arel:[]
				},
				methods: {
					succes:function(){
						let _this=this;
						axios.get("http://localhost:9095/user/e/get",{params:{"id":id}}).then(function(response) {
					    _this.article=response.data.data
						console.log(_this.article);
					});
					},
					aaa:function(){ 
						 let _this=this;
						axios.get("http://localhost:9095/user/e/selectAll",{params:{"id":id}}).then(function(response) {
					    _this.arel=response.data.data 
						console.log(_this.arel);
						});
					}
					
				 
				},
				created() {
					this.succes();
					this.aaa();
				 
				}
			})		
		 
     	
    //图片放大 预览显示
    layer.photos({
      photos: '#photos'
      ,anim: 0 //0-6的选择，指定弹出图片动画类型，默认随机（请注意，3.0之前的版本用shift参数）
    }); 
    </script>
</body>
</html>

